<template>
    <div>
        <el-checkbox-group v-model="has" style="margin-bottom: 20px;">
            <template v-for="item in data">
                <el-checkbox :label="item.value">{{item.label}}</el-checkbox>
            </template>
        </el-checkbox-group>
        <el-button type="primary" :loading="loading" @click="save">保存</el-button>
    </div>
</template>

<script>
    import {accountRole} from "@/api";

    export default {
        data() {
            return {
                checked: [],
                loading: true,
                data: [],
                has: [],
            }
        }
        , props: ['pdata']
        , mounted() {
            accountRole('get', {id: this.pdata.id}, (res) => {
                this.data = res.lists;
                this.has = res.has;
                this.loading = false;
            }, () => {
                this.$Message.error('请求错误');
            })
        }
        , methods: {
            clsoe() {
                this.$emit('close')
            }
            , save() {
                if (this.has.length == 0) {
                    this.$Message.error('请选择角色');
                    return false;
                }
                this.loading = true;
                accountRole('post', {id: this.pdata.id, roles: this.has.join(',')}, () => {
                    this.$Message.success('操作成功');
                    this.clsoe();
                }, () => {
                    this.loading = false;
                })
            }
        }
    }
</script>

<style scoped>

</style>
